<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/css/phone/swiper.min.css">
    <link rel="stylesheet" href="/css/phone/phoneblog.css">
    <script src="js/phone/fontsizeset.js"></script>
</head>

<body>

    {% block content %}
    <div class="pblog_content">
        <!-- 头部内容-->
        <div class="header">
            <div class="header_one">
                <input class="inp " type="text" placeholder="输入搜索内容">
            </div>
            <!-- 右边主体内容 -->
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="images/images1.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="images/images2.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="images/images3.jpg" alt="">
                    </div>
                </div>
                <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
            </div>
            <script src="js/phone/swiper.min.js"></script>
            <script>
                var mySwiper = new Swiper('.swiper-container', {
                    loop: true, // 循环模式选项
                    // 如果需要分页器
                    pagination: {
                        el: '.swiper-pagination',
                    },
                    // 如果需要前进后退按钮
                    navigation: {
                        nextEl: '.swiper-button-next',
                        prevEl: '.swiper-button-prev',
                    },
                })        
            </script>
        </div>
        <!-- 主体内容 -->
        <div class="body">
            <div class="pblog_content_middle">
                <ul>
                    {% for item in data %}

                    <a class="readgo" href="/pblog/{{item.id}}">
                        <li style="list-style-type: none">
                            <div class="pblog_content_middle_content">
                                <h3>{{item.title}}</h3>
                            </div>

                        </li>

                    </a>
                    {% endfor %}
                </ul>
            </div>

            </div>
            <!-- 脚部内容 -->
           






























            <!-- 头部内容 -->
            <!--  <div class="pblog_content_top">
            <div class="top_input">
                <input type="text" placeholder="输入搜索内容" id="search_input" />
            </div>
            <div class="top_lunbo">
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <img src="images/images1.jpg" alt="">
                        </div>
                        <div class="swiper-slide">
                            <img src="images/images2.jpg" alt="">
                        </div>
                        <div class="swiper-slide">
                            <img src="images/images3.jpg" alt="">
                        </div>
                    </div -->
            <!-- 如果需要导航按钮 -->
            <!--             <div class="swiper-button-prev"></div>
                    <div class="swiper-button-next"></div>
            </div>
            </div>
            <script src = "js/swiper.min.js"></script>
            <script>
                 var mySwiper = new Swiper ('.swiper-container', {
        
            </script> -->
            <!-- </div>  -->

            <!-- 中间内容 -->
            <!-- <div class="pblog_content_middle">
            <ul>
                {% for item in data %}
 
                <a class="readgo" href="/pblog/{{item.id}}">
                    <li style="list-style-type: none">
                        <div class="pblog_content_middle_content">
                            <h3>{{item.title}}</h3>
                        </div>
                        
                    </li>

                </a>
                {% endfor %}
            </ul> -->

        </div>
        <!-- 底部菜单内容 -->
        <div class="pblog_content_bottom">
            <div class="meunlist">
                <ul class="meun">
                    <li class="meunli" style="list-style-type:none;">
                        <a class="a" href="/">
                            <img class="pico" src="/img/phone/layer1.png" alt="">
                            <p class="word">首页</p>
                        </a>
                    </li>
                    <li class="meunli" style="list-style-type:none;">
                        <a class="a" href="/book">
                            <img class="pict" src="/img/phone/layer2.png" alt="">
                            <p class="word">手册</p>
                        </a>
                    </li>
                    <li class="meunli" style="list-style-type:none;">
                        <a class="a" href="/pblog">
                            <img class="pictr" src="/img/phone/layer3.png" alt="">
                            <p class="word">博客</p>
                        </a>
                    </li>
                    <li class="meunli" style="list-style-type:none;">
                        <a class="a" href="/video">
                            <img class="picfo" src="/img/phone/video.png" alt="">
                            <p class="word">视频</p>
                        </a>
                    </li>
                    <li class="meunli" style="list-style-type:none;">
                        <a class="a" href="/resource">
                            <img class="picfiv" src="/img/phone/Resources.png" alt="">
                            <p class="word">资源</p>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    {% endblock %}

</body>

</html>